*{
    margin:0;
    padding:0;
    text-decoration: none;
}
body{
    height:100%;
    display:flex;
	flex-direction:column;
}
#header{
    display: flex;
    height: 1.333333rem;
    background:rgb(255,132,29);
    .a1{
        display:inline-block;
        padding:.133333rem 2.933333rem 0 .266667rem;
        text-decoration: none;
        img{
            height:.666667rem;
            width:4.96rem;
        }
    }
    img{
        height:.906667rem;
        width:.906667rem;
        padding:.266667rem .266667rem 0 0;
    }
}

#serch{
    border-bottom: .053333rem solid rgb(223,223,223);
    div{
        height:1.333333rem;
        position: relative;
        // padding:.266667rem 0 0 .533333rem;
        input{
            border:none;
            width:9.066667rem;
            height:.8rem;
            background:rgb(241,241,241);
            border-radius:.4rem;
            padding-left:.266667rem;
            font:16px/.8rem "";
            position: absolute;
            top:.266667rem;
            left:.266667rem;
        }
        button{
            height:.8rem;
            width:1.6rem;
            background:rgb(255,132,29);
            border-radius:.4rem;
            color:white;
            text-align:center;
            border:none;
            position:absolute;
            right:.266667rem;
            top:.266667rem;
        }
    }
}

#nav{
    height:1.333333rem;
    div{
        position:relative;
        padding-left:.266667rem;
        height:.933333rem;
        background:linear-gradient(white,rgb(210,210,210) );
        a{
            display:inline-block;
            color:#666;
            font:14px/.906667rem "";
        }
        .button{
            display:inline-block;
            width:1.6rem;
            height:.693333rem;
            border-radius: .133333rem;
            text-align: center;
            position:absolute;
            right:.266667rem;
            top:.133333rem;
            font:14px/.693333rem "";
            background:linear-gradient(rgb(210,210,210),white, );
        }
    }
}

#main{
    .ul-box{
        li{
            a{
                height:2.666667rem;
                margin:0 .266667rem .266667rem .266667rem;
                display:flex;
                .left{
                    height:2.666667rem;
                    width:2.666667rem;
                    img{
                        height:2.666667rem;
                        width:2.666667rem; 
                    }
                }
                .right{
                    padding-left:.266667rem;
                    h4{
                        font:14px/.373333rem "";
                        color:#666;
                    }
                    .p1{
                        font:18px/.693333rem "";
                        color:red;
                        margin-top: .266667rem;
                    }
                    .bottom{
                        height:.533333rem;
                        font:12px/.533333rem "";
                        color:#666;
                        margin-top: .266667rem;
                        .span2{
                            padding-left: .266667rem;
                        }
                    }
                }
            }  
        }
    }
} 
        
  
#footer{
    background:rgb(239,239,239);
    .a1 {
        text-decoration: none;
        color: #666;
        display: block;
        width:9.466667rem;
        margin:.266667rem 0 .266667rem .133333rem;
        font-size: .373333rem;
        line-height: .8rem;
        border-radius: .133333rem;
        text-align: center;
        border: .026667rem solid #ddd;
        background-image: linear-gradient(#fff, #f4f4f4)
    }
    .rank {
        background: #ff841d;
        height: .906667rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-left: .266667rem;
        margin-top: .266667rem;
        .span1 {
            font-size: .48rem;
            line-height:.906667rem;
            color: white;
        }
        .a2{
            text-decoration: none;
            display:inline-block;
            height:.533333rem;
            width:.533333rem;
            background: #ff841d;
            padding-right:.266667rem ;
            img {
                width:.533333rem;
                height: .533333rem;
            }
        }
    }
    ul{
        margin-top:.533333rem;
       display:flex;
       li{
           flex:1;
           list-style: none;
           text-align: center;
           font: 16px / .88rem "";
           color:#666;
           border:.026667rem solid #ccc;
           a{
               color:#666;
           }
       }
    }
    .bottom{
        height:1.493333rem;
        .p1{
            padding-top:.266667rem;
            font-size:.373333rem; 
            text-align: center;
            .span1{
                color:red;
            }
            .span3{
                color:rgb(110,110,110);
            }
        }
        .p2{
            font-size: .32rem;
            text-align: center;
            color:rgb(110,110,110);
        }
    }
}